import React, { Component } from 'react'

export default class App extends Component {
  state = {
    name: 'react',
    count: 100,
  }
  render() {
    return (
      <div>
        App
        <br></br>
        <button onClick={() => this.setState({ name: 'xiao ming' })}>
          change name
        </button>
        <div>{this.state.name}</div>
        <div>{this.state.count}</div>
      </div>
    )
  }

  // componentWillMount 初始化
  static getDerivedStateFromProps(nextProps, nextState) {
    console.log('getDerivedStateFromProps', nextProps, nextState)
    // 返回值 将会和state 合并
    return {
      name:
        nextState.name.substring(0, 1).toUpperCase() +
        nextState.name.substring(1),
    }
  }
}
